<template>
   <div>
    <MyHeader title="购物车案例"></MyHeader>
    <div class="main">
      <MyGoods :list='list' @change='changeFn' ></MyGoods>
      <MyCount>
       <template v-slot='goods_count'>
        {{goods_count}}
      </template>
      </MyCount>
    </div>
    <MyFooter :list='list' @changeVal='AllFn'></MyFooter>
  </div>
</template>

<script>
import MyHeader from './components/MyHeader'
import MyGoods from './components/MyGoods'
import MyFooter from './components/MyFooter'
import MyCount from './components/MyCount.vue'
export default {
  components: {
    MyHeader,
    MyGoods,
    MyFooter,
    MyCount
  },
  methods:{
    //控制单选 find id
    changeFn(id){
   const res= this.list.find(item=>item.id===id)
   res.goods_state=!res.goods_state
    },
   //全选
    AllFn(val){
      console.log(val);
      this.list.forEach(item => item.goods_state=val);
    }

  },
  data(){
    return{
      list: [{"id":1,"goods_name":"班俏BANQIAO超火ins潮卫衣女士2020秋季新款韩版宽松慵懒风薄款外套带帽上衣","goods_img":"https://www.escook.cn/vuebase/pics/1.png","goods_price":108,"goods_count":1,"goods_state":true},
      {"id":2,"goods_name":"嘉叶希连帽卫衣女春秋薄款2020新款宽松bf韩版字母印花中长款外套ins潮","goods_img":"https://www.escook.cn/vuebase/pics/2.png","goods_price":129,"goods_count":1,"goods_state":true},
      {"id":3,"goods_name":"思蜜怡2020休闲运动套装女春秋季新款时尚大码宽松长袖卫衣两件套","goods_img":"https://www.escook.cn/vuebase/pics/3.png","goods_price":198,"goods_count":1,"goods_state":false},
      {"id":4,"goods_name":"思蜜怡卫衣女加绒加厚2020秋冬装新款韩版宽松上衣连帽中长款外套","goods_img":"https://www.escook.cn/vuebase/pics/4.png","goods_price":99,"goods_count":1,"goods_state":false},
      {"id":5,"goods_name":"幂凝早秋季卫衣女春秋装韩版宽松中长款假两件上衣薄款ins盐系外套潮","goods_img":"https://www.escook.cn/vuebase/pics/5.png","goods_price":156,"goods_count":1,"goods_state":true},
      {"id":6,"goods_name":"ME&CITY女装冬季新款针织抽绳休闲连帽卫衣女","goods_img":"https://www.escook.cn/vuebase/pics/6.png","goods_price":142.8,"goods_count":1,"goods_state":true},
      {"id":7,"goods_name":"幂凝假两件女士卫衣秋冬女装2020年新款韩版宽松春秋季薄款ins潮外套","goods_img":"https://www.escook.cn/vuebase/pics/7.png","goods_price":219,"goods_count":2,"goods_state":true},
      {"id":8,"goods_name":"依魅人2020休闲运动衣套装女秋季新款秋季韩版宽松卫衣 时尚两件套","goods_img":"https://www.escook.cn/vuebase/pics/8.png","goods_price":178,"goods_count":1,"goods_state":true},
      {"id":9,"goods_name":"芷臻(zhizhen)加厚卫衣2020春秋季女长袖韩版宽松短款加绒春秋装连帽开衫外套冬","goods_img":"https://www.escook.cn/vuebase/pics/9.png","goods_price":128,"goods_count":1,"goods_state":false},
      {"id":10,"goods_name":"Semir森马卫衣女冬装2019新款可爱甜美大撞色小清新连帽薄绒女士套头衫","goods_img":"https://www.escook.cn/vuebase/pics/10.png","goods_price":153,"goods_count":1,"goods_state":false}]
    }
  }
  
}
</script>

<style>
  .main{
    padding-top: 45px;
    padding-bottom: 50px;
  }
</style>